WPFにおけるデータバインディング(Data Binding)とは

データの提供元(データソース)とUI要素を結びつけること。一度バインディングを構成しておくと、データソースの値が変化した場合にUIの表示を自動的に更新したり、逆にUIからデータソースの値を更新できるようになる。同様の概念はWindows Formsにも存在するが、より手順が体系化され、使いやすくなっている。

前提1 : ソース(Source)とターゲット(Target)

データバインディングには、ソース(参照元)とターゲット(反映先)があり、通常、ソースに加えた変更がターゲットに反映される。 (設定によっては逆方向や、双方向も可能。) これは「ソースの変更をターゲットに通知する(変更通知プロパティ)」の仕組みによって成り立つ。 ソースに設定できるのは(通常の)プロパティ、ターゲットに設定できるのは依存関係プロパティ(DependencyProperty)に限定される。即ち、データバインディングは依存関係プロパティをプロパティに同期させる処置と言える。 (コントロール(UI要素)のプロパティはすべて依存関係プロパティとして実装されているため、いずれもターゲットに設定する際に特別な手順を必要としない。)

前提2 : MVVMパターン

(リンク先を併せて参照のこと。) WPFではデザインパターンとしてMVVM (Model - View - ViewModel) が推奨されており、これはWEB開発におけるMVCパターンと類似する。データバインディングはMVVMの構成要素で、View と ViewModel を関連付ける操作(の一部)である。

データバインディングの実装例

View(XAML)でバインディングを構成

ViewModel (のインスタンス)を View のDataContextとして設定することがデータバインディングの基本である。任意のクラスを ViewModel として新たに作成し、View のDataContextに設定する。

ViewModel : MainViewModel.cs

namespace Sample { // ViewModel の本体 class MainViewModel { // プロパティ public string Message { get; set; } = "サンプルメッセージ"; } }

View : MainWindow.xaml

View : MainWindow.xaml.cs

namespace Sample { public partial class MainWindow : Window { // コンストラクタ public MainWindow() { InitializeComponent(); } } }

解説

上記はMainViewModelのMessageプロパティが変更された際に、 MainWindow上のTextBlockの表示に反映される例である。まずMainViewModelをWindow(MainWindow)のDataContextとして設定している。ここで、localはMainViewModelが属する名前空間(Sample)のエイリアスである。 MainViewModelのMessageプロパティをTextBlockのTextへとデータバインディングを行っているが、 MainViewModelをDataContextとして関連づけているため、プロパティ名(Message)のみを記述すればよい。 (MainViewModel.Messageなどとする必要は無い。) DataContextの指定はコードビハインドから行うことも可能である。 (ただしMVVMとしては推奨されない。) その場合はコンストラクタ中で ViewModel のインスタンスをDataContextに代入する。なお、XAMLからDataContextの指定を行う場合、呼び出せる ViewModel のコンストラクタはデフォルトコンストラクタ(引数の無いコンストラクタ)に限定される。このため、デフォルトコンストラクタ以外を呼びたい場合はコードビハインドで指定を行うなど回避策をとる必要がある。またDataContext以外に、RelativeSourceを用いることも可能である。

コードビハインドでバインディングを構成

以下のバインディングを構成する。

ソースmyDataObject(MyData)のMyDataProperty ターゲットmyText(TextBlock)のText

FrameworkElement.SetBinding() メソッドを用いる場合

// ソースオブジェクトの作成 // myDataObject.MyDataProperty をバインドソースとする MyData myDataObject = new MyData(DateTime.Now); System.Windows.Data.Binding myBinding = new Binding("MyDataProperty"); myBinding.Source = myDataObject; // myText.Text をバインドターゲットとする // (ターゲットは依存関係プロパティに限定されるため、Text ではなく TextProperty を指定する) myText.SetBinding(TextBlock.TextProperty, myBinding);

BindingOperations.SetBinding() メソッドを用いる場合

// ソースオブジェクトの作成 // myDataObject.MyDataProperty をバインドソースとする MyData myDataObject = new MyData(DateTime.Now); System.Windows.Data.Binding myBinding = new Binding("MyDataProperty"); myBinding.Source = myDataObject; // myText.Text をバインドターゲットとする // (ターゲットは依存関係プロパティに限定されるため、Text ではなく TextProperty を指定する) BindingOperations.SetBinding(myText, TextBlock.TextProperty, myBinding);

バインディングの書式

XAMLにおけるバインディングの書式は上記のようになる。 Bindingの子要素(プロパティ)を,(カンマ)で区切って書き連ね、全体を{}(ブレース)で囲む。ここで、Pathは省略可能で、

<TextBlock Text="{Binding Path=Message, Mode=TwoWay}"/>

と

<TextBlock Text="{Binding Message, Mode=TwoWay}"/>

は等価である。下表に、設定可能なBindingの主要なプロパティを抜粋する。これ以外はBindingクラスのリファレンスを参照のこと。

プロパティ名	解説	取りうる値		備考
Path	ソースプロパティのパス
RelativeSource	ソースオブジェクトを、ターゲットからの相対位置で指定する			参考ページ(RelativeSource)
Mode	バインドの方向 (省略時はDefault)	Default	コントロールごとの既定値	リファレンス(BindingMode)
		OneTime	ソース⇒ターゲット(1回のみ)
		OneWay	ソース⇒ターゲット
		OneWayToSource	ターゲット⇒ソース
		TwoWay	ソース⇔ターゲット
Converter	使用するコンバーター			参考ページ(コンバーター)
ConverterParameter	コンバーターに渡すパラメータ			参考ページ(コンバーター)

目次 :